// pages/Search/Search.js
import {
  isStringHasValue
} from "../../utils/valid"
import {
  queryTopSearches
} from "../../service/search"

Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 搜索框的值
    searchBoxValue: "",
    // 最近搜索历史
    recentSearches: [],
    // 热搜条目
    hotItems: []
  },
  /**
   * 点击搜索框按钮
   */
  onTapSearchButton() {
    const value = this.data.searchBoxValue
    if (!isStringHasValue(value)) {
      wx.showToast({
        title: '请输入搜索的内容',
        icon: "none"
      })
      return
    }
    // 首先保存搜索历史到本地
    this.saveSearchHistory(value)
    // 跳转到商品搜索页面
    wx.navigateTo({
      url: `/pages/Hunt/Hunt?keyword=${this.data.searchBoxValue}`,
    })
  },
  /**
   * 搜索框输入内容
   */
  onInputSearchBox(event) {
    this.data.searchBoxValue = event.detail.value
  },
  /**
   * 点击删除搜索历史按钮
   */
  onTapDeleteButton() {
    wx.showModal({
      title: '提示', // 对话框标题（可选）
      content: '确认清空搜索历史？', // 对话框内容（可选）
      showCancel: true, // 是否显示取消按钮，默认true
      cancelText: '取消', // 取消按钮文字，默认"取消"
      cancelColor: '#000000', // 取消按钮颜色，默认#000000
      confirmText: '确定', // 确定按钮文字，默认"确定"
      confirmColor: '#1989fa', // 确定按钮颜色，默认#52c41a
      success: (res) => { // 接口调用成功的回调函数
        if (res.confirm) {
          wx.removeStorageSync('searchHistory');
          this.setData({
            recentSearches: []
          });
        } else if (res.cancel) {
        }
      }
    });

  },
  /**
   * 保存搜索历史
   */
  saveSearchHistory(keyword) {
    if (!isStringHasValue(keyword)) return
    const historyList = wx.getStorageSync('searchHistory') || [];
    const newHistory = historyList.filter(item => item !== keyword);
    newHistory.unshift(keyword);
    if (newHistory.length > 20) newHistory.pop();
    wx.setStorageSync('searchHistory', newHistory);
    this.setData({
      recentSearches: newHistory
    })
  },
  /**
   * 生命周期函数
   */
  async onLoad() {
    const historyList = wx.getStorageSync('searchHistory') || [];
    this.setData({
      recentSearches: historyList
    });
    const res = await queryTopSearches()
    this.setData({
      hotItems: res.data
    })
  },
  /**
   * 点击最近搜索或者是搜索发现中的小卡片
   */
  onTapItem(event) {
    const keyword = event.target.dataset.keyword
    this.setData({
      searchBoxValue: keyword
    })
    this.onTapSearchButton()
  }

})